<template>
	<!-- 首页 -->
	<view class="home">
		<view class="ul">
			<view class="li" v-for="(item, index) of lists" :key="'li'+index"  @tap="tapLi(item)">
				{{item.name}}
			</view>
			
		</view>
	</view>
</template>

<script>
	export default{
		data() {
			return {
				lists: [
					{
						id: 1,
						index: 1,
						name: '自定义头部',
						path: '/pages/customHeader/header',
					},
					{
						id: 2,
						index: 2,
						name: '右边滑入遮罩层',
						path: '/pages/sideShade/sideShade',
					},
					{
						id: 3,
						index: 3,
						name: '登录',
						path: '/pages/login/login',
					}
				]
			}
		},
		methods: {
			/**
			 * 点击列表
			 */
			tapLi(item) {
				uni.navigateTo({
					url: item.path
				})
			}
		}
	}
</script>

<style lang="scss">
	.home{
		padding: 30rpx 22rpx;
		.ul{
			.li{
				height: 88rpx;
				line-height: 88rpx;
				font-size: 28rpx;
				color: #333;
				border-bottom: 1px solid #dcdcdc;
				overflow-x: scroll;
			}
		}
	}
</style>
